<!--  -->
<template>
 <el-dialog
    v-model="dialogVisible"
    title="添加楼栋"
    width="500"
    :before-close="handleClose"
  >

  {{ model }}
  <el-form   label-width="auto" style="max-width: 600px">
    <el-form-item v-if="model.id==0 && model.pid>0" label="父级楼栋名称">
      <el-input disabled v-model="model.parentName" />
    </el-form-item>
    <el-form-item label="名称">
      <el-input v-model="model.name" />
    </el-form-item>
    </el-form>

    <template #footer>
      <div class="dialog-footer">
        <el-button @click="handleClose">取消</el-button>
        <el-button type="primary" @click="submit">
          提交
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script lang='ts' setup>
import { reactive,defineProps,withDefaults,ref,defineEmits} from 'vue'
import { addBuilding } from '../../service/building/building';
interface TreeData{
    
    id?:number,
    name?:string,
     pid?: number,
     parentName?:string
}

const props=withDefaults(defineProps<{treeData:TreeData}>(),{

    treeData:()=>({ id:0,
    name:"",
     pid: 0,
     parentName:""})
   
})
const model=reactive<TreeData>({
    id:0,
    name:"",
     pid: 0,
     parentName:""
})

Object.assign(model,props.treeData);


const emit=defineEmits(["close"])
const dialogVisible=ref(true);
const handleClose=()=>{
    emit("close");
}

const submit=async ()=>{
  const res:any=await  addBuilding(model);
  if(res.errCode===10000){
    emit("close",true);

  }
}
</script>
<style scoped>
</style>